<template>
    <ul class="ul-flex">
        <li
            v-for="(item, index) in marketingData"
            :key="index"
            class="li-wrap"
            :style="`background: url('${item.iconUrl}') no-repeat;
          backgroundSize: 40px 40px;
          backgroundPosition: 148px 20px;`"
        >
            <h6 class="top">{{ item.title }}</h6>
            <div class="mid">
                {{ item.size }}
            </div>
            <div class="bottom">
                <span>
                    今日已处理
                    <i class="i">{{ item.tipsLV }}</i>
                </span>
            </div>
        </li>
    </ul>
</template>

<script>
export default {
    props: {
        bgmData: {
            type: Array,
            default: () => []
        }
    },
    data() {
        return {
            marketingData: [
                {
                    title: '待签约审核',
                    size: '0',
                    tipsLV: '0',
                    iconUrl: '/static/icon/house/icon_16.png'
                }
            ]
        };
    }
};
</script>

<style lang="scss" scoped>
.ul-flex {
    display: flex;
    flex-flow: row wrap;
    .li-wrap {
        width: 200px;
        height: 134px;
        background: #fff;
        box-shadow: 0px 2px 4px 0px rgba(11, 70, 89, 0.1);
        border-radius: 20px 20px 20px 20px;
        padding: 15px;
        margin-right: 20px;
        .top {
            height: 24px;
            font-size: 16px;
            font-weight: 500;
            color: #1d252f;
            line-height: 24px;
        }
        .mid {
            height: 30px;
            line-height: 30px;
            font-size: 24px;
            font-weight: bold;
            color: #1d2129;
            margin: 10px 0;
        }
        .bottom {
            width: 170px;
            height: 30px;
            line-height: 30px;
            font-size: 12px;
            color: #4e5969;
            background: #f8f8f8;
            border-radius: 6px 6px 6px 6px;
            padding: 0 12px;
            .i {
                color: #2cab40;
                font-style: normal;
            }
        }
    }
}
</style>
